<template>
  <router-view v-if="!$route.meta.keepAlive" />
  <loading :show-loading="showLoading" :loading-text="loadingText" />
</template>

<script setup>
import {
  onBeforeMount,
  onMounted,
  onUnmounted,
  watch,
  computed,
  provide,
  inject,
  ref,
  reactive,
  nextTick
} from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { showDialog, showFailToast } from 'vant'
const router = useRouter()
const route = useRoute()
import { getWXjssdkConfig } from '@/request/api'
import { isIOS, handleFontSize } from '@/utils'
import wx from 'weixin-js-sdk'
provide('showPageLoading', showPageLoading)
provide('hidePageLoading', hidePageLoading)
provide('locationTips', locationTips)
provide('getLocation', getLocation)
provide('chooseImage', chooseImage)
provide('wxgetLocalImgData', wxgetLocalImgData)
provide('wxUploadImage', wxUploadImage)
provide('wxClose', wxClose)
provide('wxShare', wxShare)
provide('hideAllNonBaseMenuItem', hideAllNonBaseMenuItem)
provide('showAllNonBaseMenuItem', showAllNonBaseMenuItem)
provide('showMenuItems', showMenuItems)
provide('hideMenuItems', hideMenuItems)

const showLoading = ref(false)
const loadingText = ref('')
onBeforeMount(() => {
  // 在加载前就要设置网页字体为默认大小
  handleFontSize()
})
onMounted(() => {
  // sessionStorage.setItem('openId', route.query.openId)
  // sessionStorage.setItem('headUrl', route.query.headUrl)
  // WXjssdkConfig()
  // const title = '寻找瑞众有缘人'
  // const desc = '瑞庆元年，众寻佳缘，心动豪礼，速来领取！'
  // let link
  // if (sessionStorage.getItem('ruiChannel') == 'zj') {
  //   link = `https://gdinfo.ruiinsurance.com/luckyManJd/customerEntry?JdCode=${sessionStorage.getItem('JdCode')}&JdName=${sessionStorage.getItem('JdName')}`
  // } else {
  //   link = `https://gdinfo.ruiinsurance.com/predestinedMan2024/introduce_yx?agentcode=${sessionStorage.getItem('agentcode')}`
  //   // link = `https://gdinfo.ruiinsurance.com/luckyManYx/customerEntry?agentcode=${sessionStorage.getItem('agentcode')}`
  // }
  // const imgUrl =
  //   'https://gdinfo.ruiinsurance.com/predestinedMan2024/wxShareImgUrl/predestinedMan2024.png'
  // wxShare(title, desc, link, imgUrl)
})

function WXjssdkConfig() {
  // 获取微信配置信息，涉及到appid
  // 源代码是encodeURIComponent(location.href.split('#')[0])，事实测试是签名会无效
  console.log('==========getWXjssdkConfig=========')
  getWXjssdkConfig(location.href.split('#')[0]).then((data) => {
    console.log('getWXjssdkConfig', data)
    if (data.success) {
      wx.config({
        debug: false,
        appId: data.appId,
        timestamp: data.timestamp,
        nonceStr: data.nonceStr,
        signature: data.signature,
        jsApiList: [
          'hideAllNonBaseMenuItem', // 微信隐藏所有非基础按钮接口
          'showAllNonBaseMenuItem', // 微信显示所有功能按钮接口
          'showMenuItems', // 微信要显示的菜单项，所有menu项见附录3
          'hideMenuItems', // 微信要隐藏的菜单项，只能隐藏"传播类"和"保护类"按钮，所有menu项见附录3
          'getLocation', // 定位服务
          'chooseImage', // 拍照或从手机相册中选图接口
          'getLocalImgData', // 拍照或从手机相册中选图接口
          'previewImage', // 预览图片接口
          'uploadImage', // 上传图片接口
          'downloadImage', // 下载图片接口,
          'closeWindow', // 关闭微信页面窗口
          'updateAppMessageShareData', // 分享给朋友
          'updateTimelineShareData' // 分享到朋友圈
        ]
      })
    }
  })
}
//   设置微信分享
//   const title = "瑞众保险广分银保日报表"
//   const desc = "瑞众保险广分银保带网、直营日报表"
//   const link = window.location.href
//   const imgUrl = "https://gdinfo.ruiinsurance.com/common/web/zl/healthInfo/img/loadingLogo.png"
//   setWXshare(title, desc, link, imgUrl)
function wxShare(title, desc, link, imgUrl) {
  wx.ready(() => {
    wx.updateAppMessageShareData({
      title: title, // 分享标题
      desc: desc, // 分享描述
      link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      imgUrl: imgUrl, // 分享图标
      success: function (res) {
        console.log('updateAppMessageShareData--success')
      },
      cancel: function (res) {},
      fail: function (res) {}
    })
    // 朋友圈或QQ空间分享
    wx.updateTimelineShareData({
      title: title, // 分享标题
      desc: desc, // 分享描述
      link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      imgUrl: imgUrl, // 分享图标
      success: function (res) {
        console.log('updateTimelineShareData--success')
      },
      cancel: function (res) {},
      fail: function (res) {}
    })
  })
}
// count,数字，最大只能设置为9张图片，
// sourceType=album, camera, 可以指定来源是相册还是相机，false默认二者都有
// callback，(localIds：本地ID列表, localData：图片的base64数据)两个返回值
function chooseImage(count, sourceType, callback) {
  wx.chooseImage({
    count: count, //最大只能设置为9张图片
    sizeType: ['compressed'],
    sourceType: sourceType ? `['${sourceType}']` : ['album', 'camera'],
    success: function (data) {
      const localIds = data.localIds // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
      return callback(localIds)
    },
    fail: function (res) {
      showFailToast(JSON.stringify(res))
    }
  })
}
function wxgetLocalImgData(localIds, callback) {
  wx.getLocalImgData({
    localId: localIds, // 图片的localID
    success: function (res) {
      var localData = res.localData // localData是图片的base64数据，可以用img标签显示
      localData = localData.replace('jgp', 'jpeg') // iOS 系统里面得到的数据，类型为 image/jgp,因此需要替换一下
      return callback(localData)
    },
    fail: function (res) {
      alert('显示失败')
    },
    complete: function (res) {}
  })
}
function wxUploadImage(id, callback) {
  wx.uploadImage({
    localId: id.toString(), // 需要上传的图片的本地ID，由chooseImage接口获得
    isShowProgressTips: 1, // 默认为1，显示进度提示
    success: function (res) {
      console.log('uploadImage', res)
      const mediaId = res.serverId
      return callback(mediaId)
    },
    fail: function (error) {
      showFailToast(JSON.stringify(error))
    }
  })
}
function getLocation(callback) {
  console.log('======getLocation=======')
  wx.ready(function () {
    console.log('getLocation')
    wx.getLocation({
      type: 'wgs84', // 默认为wgs84的gps坐标
      success: function (res) {
        console.log('======getLocation,success=======')
        console.log(res)
        const latitude = res.latitude // 纬度，浮点数，范围为90 ~ -90
        const longitude = res.longitude // 经度，浮点数，范围为180 ~ -180。
        return callback({
          latitude,
          longitude
        })
      }
    })
  })
}
function hideMenuItems() {
  wx.ready(function () {
    wx.hideMenuItems({
      // 微信要隐藏的菜单项，只能隐藏"传播类"和"保护类"按钮，所有menu项见附录3
      menuList: []
    })
  })
}
function showMenuItems() {
  wx.ready(function () {
    wx.showMenuItems({
      // 微信要显示的菜单项，所有menu项见附录3
      menuList: [
        'menuItem:share:appMessage',
        'menuItem:share:timeline',
        'menuItem:share:qq',
        'menuItem:share:QZone'
      ]
    })
  })
}
function hideAllNonBaseMenuItem() {
  wx.ready(function () {
    wx.hideAllNonBaseMenuItem() // 微信隐藏所有非基础按钮接口
  })
}
function showAllNonBaseMenuItem() {
  wx.ready(function () {
    wx.showAllNonBaseMenuItem() // 微信显示所有功能按钮接口
  })
}
function locationTips(isAgent) {
  const agentTips = isAgent ? ',建议清除缓存后重试' : ''
  if (isIOS()) {
    showDialog({
      message:
        '定位失败，请您确认是否已开启定位服务（请前往"设置-隐私-定位服务"开启定位），并确认网络是否通畅' +
        agentTips
    }).then()
  } else {
    showDialog({
      message:
        '定位失败，请您确认是否已开启定位服务（请前往"设置"中开启定位），并确认网络是否通畅' +
        agentTips
    }).then()
  }
}
function wxClose() {
  console.log('wxClose')
  wx.ready(() => {
    wx.closeWindow()
  })
}
// 可传入'定位中'
function showPageLoading(Text) {
  showLoading.value = true
  loadingText.value = Text
}
function hidePageLoading() {
  showLoading.value = false
}
</script>
<style lang="less" scoped>
#app {
  background-image: url('@imgs/index_bg.png');
  //  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
/* 限制文字大小 */
html body {
  text-size-adjust: none !important;
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
}
* {
  margin: 0;
  padding: 0;
  text-size-adjust: none !important;
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
}
// 数字字体
@font-face {
  font-family: 'D-DIN';
  src: url('@/assets/fonts/D-DIN.otf') format('truetype');
}

#app {
  font-family: 'D-DIN';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  position: fixed;
  background-color: #ffffff;

  /* 控制页面能否滚动 */
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s;
}
.fade-enter, .fade-leave-to
/* .fade-leave-active below version 2.1.8 */ {
  opacity: 0;
}

.bounce-enter-active {
  animation: bounce-in 0.5s;
}
.bounce-leave-active {
  animation: bounce-in 0.5s reverse;
}
@keyframes bounce-in {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}


</style>
